<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
    pageEncoding="ISO-8859-1"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<%@ include file="../common/taglibs.jsp"%>

<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<link rel="StyleSheet" type="text/css" href="<%=request.getContextPath()%>/pages/css/common.css"></link>
<link rel="StyleSheet" type="text/css" href="<%=request.getContextPath()%>/pages/css/password.css"></link>
<script type="text/javascript" src="<%=request.getContextPath()%>/pages/js/jquery-1.5.js" ></script>
<script type="text/javascript" src="<%=request.getContextPath()%>/pages/js/jquery.validate.min.js" ></script>
<script type="text/javascript">
	
	$(document).ready(function() {
		$('#subCat').live('change', function() {
			$.post('showProducts', $("#editProductForm").serialize(), function(data) {
				$('#productDiv').html(data);
				if($("#subCat").val() == 0){
					$('#productDiv').html("<select></select>");
				}

				emptyProductAttributes();
			});
		});
		$('#cat').live('change', function() {
			$.post('showSubCategories', $("#editProductForm").serialize(), function(data) {
				$('#subCategories').html(data);
				emptyProductAttributes();
				$('#productDiv').html("<select></select>");
				if($("#cat").val() == 0){
					$('#subCategories').html("<select></select>");
					
				}
			});
		});
/* 		$('#prd').live('change', function() {
			$.post('productDetailsJSON', $("#editProductForm").serialize(), function(data) {
				$("#editProductForm_code").val(data.product.prdCode);
				$("#editProductForm_name").val(data.product.prdName);
				$("#editProductForm_desc").val(data.product.prdDesc);
				$("#editProductForm_vendor").val(data.product.vendor);
				$("#editProductForm_reOrderLevel").val(data.product.reOrderLevel);
				$("#editProductForm_clt").val(data.product.clt);
				
				var html = "";
				$.each(data.product.airlineDetails, function(key, airLine){
					html += "<tr>";
					html += "<td>";
					html += airLine.airline.alDesc;
					html += "</td>";
					html += "<td>";
					html += airLine.unitPrice;
					html += "</td>";
					html += "<td>";
					html += airLine.discountRate;
					html += "</td>";
					html += "</tr>";
					alert(key + ":" + airLine);
				});
				$("#airlines").html(html);
			});
		}); */
		
		$('#prd').live('change', function() {
			$.post('productAttributes', $("#editProductForm").serialize(), function(data) {
				$('#productAttributes').html(data);
			});
		});

	});

	function emptyProductAttributes(){
		$("#editProductForm_code").val("");
		$("#editProductForm_name").val("");
		$("#editProductForm_desc").val("");
		$("#editProductForm_vendor").val("");
		$("#editProductForm_reOrderLevel").val("");
		$("#editProductForm_clt").val("");
	}
</script>

<style type="text/css">
table.sample {
	border-width: 1px;
	border-spacing: 2px;
	border-style: outset;
	border-color: gray;
	border-collapse: collapse;
	background-color: white;
}
table.sample th {
	border-width: 1px;
	padding: 1px;
	border-style: inset;
	border-color: gray;
	background-color: white;
	-moz-border-radius: ;
}
table.sample td {
	border-width: 1px;
	border-style: inset;
	border-color: gray;
	background-color: white;
	-moz-border-radius: ;
}
</style>
<title>DFASS</title>
</head>
<body>
	<div class="headerContent" align="center">
		<div class="header">
		<%@ include file="../inc/logged_top.jsp" %>			
		</div>
		<div id="nav_container">
		<%@ include file="../menu/mb_menu_inventory.jsp" %>
	    </div>
	</div>
	<div class="bodyContent" align="center">
		<table><tr><td>&nbsp;</td></tr></table>
		<!-- This Empty Table is Required before the content of the body -->
		<s:form theme="simple" id="editProductForm" name="editProductForm" method="post" action="submitEditProduct">		
			<s:hidden name="id" value="%{product.id}"></s:hidden>
			<table class="tblAdminNormal" width="800px;">
				<thead>
					<tr>
						<td colspan="6">Product update</td>
					</tr>
				</thead>
				<tbody>
				    <tr class="removableElement">
				    <td>Code</td>
				    <td><s:textfield name="code" cssStyle="width:150px" value="%{product.code}"/></td>
				</tr>
				<tr class="removableElement">
				    <td>Name</td>
				    <td><s:textfield name="name" cssStyle="width:150px"  value="%{product.name}" /></td>
				</tr>
				<tr class="removableElement">
				    <td>Description</td>
				    <td><s:textfield name="desc" cssStyle="width:150px" value="%{product.description}"/></td>
				</tr>
				<tr class="removableElement">
				    <td>Vendor</td>
				    <td><s:textfield name="vendor" cssStyle="width:150px" value="%{product.vendor}"/></td>
				</tr>
				<tr class="removableElement">
				    <td>Re-order level</td>
				    <td><s:textfield name="reOrderLevel" cssStyle="width:150px" value="%{product.reOrderLevel}"/></td>
				</tr>
				<tr class="removableElementLast">
				    <td>Critical Lower Threshold</td>
				    <td><s:textfield name="clt" cssStyle="width:150px" value="%{product.clt}"/></td>
				</tr>
				<tr>
					<td colspan="2">
						<table width="100%">
							<tr>
								<td>Airline name</td>
								<td>Currency</td>
								<td>Unit price</td>
								<td>Discount rate</td>
							</tr>
							<s:iterator value="product.airlineProducts">
								<s:hidden name="airlineProductId" value="%{id}"></s:hidden>
								<tr>
										<td><s:label value="%{airline.name}"></s:label> </td>
										<td><s:select name="currency_%{id}" list="currencies" listKey="id" listValue="code" value="%{currency.id}"></s:select> </td>
										<td><s:textfield name="unitPrice_%{id}" value="%{unitPrice}"/></td>
										<td><s:textfield name="discountRate_%{id}" value="%{discountRate}"/></td>
								</tr>
							</s:iterator>
						</table>
					</td>
				</tr>
		    <tr>
		        <td></td> 
		        <td><s:submit value="Update" cssClass="button" /></td> 
		    </tr>
		    <tr>
		        <td colspan="5">
		        	<s:actionmessage cssClass="successMsg" />
		        	<s:fielderror cssClass="errorMsg" />
		        </td> 
		    </tr>
			</tbody>
		</table>
	</s:form>
	</div>				
	
	<div class="footerContent" align="center">
		<div class="footer">
			<%@ include file="/pages/inc/footer.jsp" %>
		</div>
	</div>
</body>
</html>